<ion-header >
  <ion-navbar>

    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>
      <div style="margin: 15px 0" >
        <p tappable (click)="gotoQRCodePage()">{{userName}}</p>
        <p class="cut-title">{{'HOME.WELCOME' | translate }}{{factoryName}}</p>
      </div>
    </ion-title>
    <ion-buttons *ngIf="messageCount > 0" end>
      <button tappable ion-button icon-only (click)="gotoUnreadMessage()" >
        <ion-icon color="Gray-color" name="ios-mail-outline">
          <ion-badge class="bage-message">{{messageCount}}</ion-badge>
        </ion-icon>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button tappable ion-button icon-only (click)="gotoHomePage()" >
        <ion-icon color="Gray-color" name="ios-home-outline">
        </ion-icon>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button tappable ion-button icon-only (click)="goSettingPage()" >
        <ion-icon color="Gray-color" name="settings">
        </ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>



<ion-content>
  <ion-card *ngIf="orderList?.length > 0" tappable="" (click)="gotoWaitingUse()">
    <ion-slides [autoplay]="2000" [loop]="orderList.length > 1"  pager>

      <ion-slide *ngFor="let item of orderList" >
        <img class="img-item" src="{{item.imgUrl}}"/>
        <div class="back-ground">

        </div>
        <div class="card-title">
          <div style="font-size: 2rem">
            {{item.productName}}
          </div>
          <div style="font-size: 1.7rem">
            {{item.factoryName}}-{{item.officeName}}
          </div>
          <div style="font-size: 2rem">
            {{item.label}}
          </div>
        </div>
      </ion-slide>
    </ion-slides>
  </ion-card>

  <ion-card *ngIf="(isNull && orderList.length === 0)">
    <img tappable (click)="gotoOrder(factoryName)" class="img-item" src="https://fasohdininghallstorage02.blob.core.chinacloudapi.cn/live/index_002.jpg"/>
  </ion-card>




  <ion-card tappable (click)="gotoOrder(factoryName)">
    <img class="img-item" src="https://fasohdininghallstorage02.blob.core.chinacloudapi.cn/live/index_003.png"/>
    <div class="order-tile">
      {{'HOME.ORDER' | translate }}
    </div>
  </ion-card>

  <div class="footer-card">
    <div class="logo">
      <img src='assets/imgs/Blank_Image_2.png' alt="">
    </div>
    <!--<ion-card >-->
      <!--<img class="img-item" src="assets/imgs/Blank_Image.png"/>-->
      <!--<div class="order-tile">-->
      <!--</div>-->
    <!--</ion-card>-->
  </div>

</ion-content>

<!--二维码按钮-->
<!--<div class="qrcode-btn" tappable (click)="gotoQRCodePage()">-->
  <!--<img src="assets/imgs/QR_code.png" alt="">-->
<!--</div>-->

